/*
 * Buttons
 */

.button{
    display: inline-block;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    padding: 0;
    margin: 0;
    border: none;
    -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
}


/* colors */

.button.gray{
    color: #777;

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#dddddd'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#ddd)); /* for chorme or safari */
    background: -moz-linear-gradient(top, #eee, #ddd); /* for mozilla */
    text-shadow: 0px 1px 1px #fff;
    border: solid 1px #ccc;
}
.button.gray:hover{
    color: #333;
    -webkit-box-shadow: 0 0 8px #ccc;
    -moz-box-shadow: 0 0 8px #ccc;
    box-shadow: 0 0 8px #ccc;
    text-decoration: none;
}

.button.green{
    color: #fff;
    border: solid 1px #070;

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00bb00', endColorstr='#008800'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#0b0), to(#080)); /* for chorme or safari */
    background: -moz-linear-gradient(top, #0b0, #080); /* for mozilla */
    text-shadow: -1px 0px 1px #040;
}
.button.green:hover{
    -webkit-box-shadow: 0 0 8px #070;
    -moz-box-shadow: 0 0 8px #070;
    box-shadow: 0 0 8px #070;
    text-decoration: none;
}

.button.blue{
    color: #fff;
    border: solid 1px #2879A1;
    
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#66ccff', endColorstr='#3399cc'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#6cf), to(#39c)); /* for chorme or safari */
    background: -moz-linear-gradient(top, #6cf, #39c); /* for mozilla */
    text-shadow: -1px 0px 1px #184A63;
}
.button.blue:hover{
    -webkit-box-shadow: 0 0 6px #2879A1;
    -moz-box-shadow: 0 0 6px #2879A1;
    box-shadow: 0 0 6px #2879A1;
    text-decoration: none;
}

.button.red{
    color: #fff;
    border: solid 1px #800;

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0000', endColorstr='#aa0000'); /* for IE */
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f00), to(#a00)); /* for chorme or safari */
    background-image: -moz-linear-gradient(top, #f00, #a00); /* for mozilla */
    text-shadow: -1px 0px 1px #400;
}
.button.red:hover {
    -webkit-box-shadow: 0 0 8px #800;
    -moz-box-shadow: 0 0 8px #800;
    box-shadow: 0 0 8px #800;
    text-decoration: none;
}

/* sizes */
.button.small{
    font: normal 11px arial;
    padding: 3px 8px;
}

.button.medium{
    font: normal 12px arial;
    padding: 10px 20px;
}

.button.large{
    font: normal 18px arial;
    padding: 10px 30px;
}